<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <!-- import CSS -->
    <link rel="stylesheet" href="https://cdn.staticfile.org/element-ui/2.15.9/theme-chalk/index.css">

</head>
<body>
<div id="app">
    <el-main>
        <el-row gutter="20">
            <el-col span="10" align="center">
                <el-col span="18" style="margin: 0 auto">
                    <el-carousel height="400px" style="width: 400px;" >
                        <col span="">
                        <el-carousel-item v-for="url in picArr">
                            <img :src="url" width="`25%" height="100%">
                        </el-carousel-item>
                    </el-carousel>
                </el-col>
              </el-col>
                <p style="font-size: 25px;font-weight: bold">永恒回忆</p>
                <el-divider></el-divider>
                <div info-msg clearfix>
                    <p style="font-size: 15px;">材料:</p>
                    <span>红玫瑰33枝，石竹梅外围点缀</span>
                </div>
                <div><p style="font-size: 15px;">包装:</p>
                    <span>白色棉纸内包，黑色包装纸外围圆形包装，红色丝带蝴蝶结</span>
                </div>
                <div><p style="font-size: 15px;">附送:</p>
                    <span>下单填写留言，免费赠送贺卡</span>
                </div>
                <div><p style="font-size: 15px;">配送:</p>
                    <span>全国送货上门，市区免运费</span>
                </div>
                <div><p style="font-size: 15px;">优惠券:</p>
                    <span>暂无优惠券</span>
                </div>
                <div class="input-group fr">
                    <input type="text" readonly="" class="layui-input" id="test1" style="width: 140px;" lay-key="1">
                    <div align="center">

                        <script language="javascript">

                            var my = new Date();


                            function showc() {

                                var k = 1;

                                var j = 1;

                                var today;

                                var tomonth;

                                var theday = 1;//日期

                                var max;

                                var temp;

                                var tempday;//这个月第一天的星期

                                document.write("<b>" + my.getFullYear() + "-" + (my.getMonth() + 1) + "</b>");

                                document.write("<table border='1' width='273' height='158'>");

                                document.write("<tr>");

                                document.write("<td height='23' width='39'><font color='red'>Sun</font></td>");

                                document.write("<td height='23' width='39'>Mon</td>");

                                document.write("<td height='23' width='39'>Tue</td>");

                                document.write("<td height='23' width='39'>Wed</td>");

                                document.write("<td height='23' width='39'>Thu</td>");

                                document.write("<td height='23' width='39'>Fri</td>");

                                document.write("<td height='23' width='39'>Sat</td>");

                                document.write("</tr>");

                                temp = my.getDate();

                                my.setDate(1);

                                //document.write (my.getDate());

                                tempday = my.getDay();//返回第一天是星期几

                                my.setDate(temp);

                                today = my.getDay();//返回现在星期几


                                switch ((my.getMonth() + 1)) {

                                    case 1:

                                    case 3:

                                    case 5:

                                    case 7:

                                    case 8:

                                    case 10:

                                    case 12:

                                        max = 31;

                                        break;

                                    case 4:

                                    case 6:

                                    case 9:

                                    case 11:

                                        max = 30;

                                        break;

                                    default:

                                        max = 29;//这里没有考虑闰月！！

                                    //document.write (max);

                                }

                                for (k = 0; k < 6; k++) {

                                    document.write("<tr>");

                                    for (j = 0; j <= 6; j++) {

                                        document.write("<td height='23' width='39'>");

                                        if (j >= (tempday)) {

                                            tempday = 0;//设置为最小，相当于取消判断条件

                                            if (theday <= max) {

                                                document.write("<a title=" + my.getFullYear() + "-" + (my.getMonth() + 1) + "-" + theday + " target='_blank' href=detail.asp?date=" + theday + ">");

                                                if (theday == my.getDate())

                                                    document.write("<font color='green'>[" + theday + "]</font></a>");

                                                else if (j == 0)

                                                    document.write("<font color='red'>" + theday + "</font></a>");

                                                else

                                                    document.write(theday + "</a>");

                                                theday++;

                                            }

                                        }

                                        document.write("</td>");

                                    }

                                    document.write("</tr>");

                                }

                                document.write("</table>");

                            }


                            showc();

                        </script>

                    </div>
                    <select id="freight" class="selectInput">
                        <option value="1">不限时间</option>
                        <option value="2">
                            8:00-10:00
                        </option>

                        <option value="3">
                            10:00-12:00
                        </option>

                        <option value="4">
                            12:00-14:00
                        </option>

                        <option value="5">
                            14:00-16:00
                        </option>

                        <option value="6">
                            16:00-18:00
                        </option>

                        <option value="7">
                            18:00-20:00
                        </option>

                        <option value="8">
                            20:00-22:00
                        </option>

                        <option value="15">
                            上午
                        </option>

                        <option value="16">
                            下午
                        </option>

                        <option value="17">
                            晚上
                        </option>
                    </select>

                    <select name="" id="transport" class="selectInput">
                        <option value="0">市区免费配送</option>

                        <option value="30.00">
                            近郊+30.00运费
                        </option>

                        <option value="50.00">
                            远郊+50.00运费
                        </option>
                    </select>
                </div>
                <div class="info-price">
                    <div class="clearfix info-price-top">
                        <p class="fl">
                                <span id="festival-block">


                                    店铺价：
                                </span>
                            <span class="info-price-number">￥<span id="festival-price">328</span></span>
                        </p>
                    </div>
                    <div class="clearfix info-price-bottom">
                        <p class="fl">
                                <span>
                                    市场价：
                                </span>
                            <del class="info-price-number">
                                ￥<span id="market-price">399</span>
                            </del>
                        </p>
                        <p class="fr info-price-xiaoliang">
                            销量<span>16022</span>笔
                        </p>
                    </div>
                </div>
            </el-col>
            </el-col>
        </el-row>

    </el-main>
</div>
</body>
<!-- import Vue before Element -->
<script src="https://cdn.staticfile.org/vue/2.6.14/vue.min.js"></script>
<!-- import JavaScript -->
<script src="https://cdn.staticfile.org/element-ui/2.15.9/index.min.js"></script>
<script>
    let v = new Vue({
        el: '#app',
        data: function () {
            return {
                picArr: ["imgs/1.jpg", "imgs/2.jpg", "imgs/3.jpg", "imgs/4.jpg",]
            }
        },
        methods: {}
    })
</script>
</html>